<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>demo</title>
  <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<script>
  /**
   * 上传图片
   */
  function uploadImg(){

    /**
     * formData在jquey中使用需要设置：
     * processData: false, // 告诉jQuery不要去处理发送的数据
     * contentType: false // 告诉jQuery不要去设置Content-Type请求头
     * @type {null}
     */
    var fd = new FormData();

    // 第一个参数为controller 接收的参数名称 , input的id
    fd.append("file", document.getElementById("inputId").files[0]);
    $.ajax({
      url:"http://localhost:8082/qiniu/image",
      type:"post",
      data:fd,
      processData:false,
      contentType:false,
      success:function(res){
        console.log(res);

        if (res.status.code == 0) {
          if (!$('#img').empty()) {
            $('#img').empty();
          }
          // 这一串代码复制不上来 ,截图在下面
          $('#img').append(" ![](+res.result[0]+)");
        } else {
          alert("图片上传失败");
        }
      },
      dataType:"json"
    })
  }
</script>

<div id="img">
  <input type="file" name="text" id="inputId">
  <input type="submit" onclick="uploadImg()">

</div>

</body>
</html>